import React from 'react'
import {Row, Col, Card, message} from 'antd'
import {LeftOutlined} from '@ant-design/icons';
import '../styles.css'
import api from "../../../api/api";
import axios from "axios";


class CheckinRecordDetail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            title: "新增公司",
            uName:"",
            uPwd:"",
            detailHiddenForGuest: true,
            hiddenPeopleNumber2: false,
            param:{
                name1:"",
                gender1:"",
                phone1:"",
                idcard1:"",
                name2:"",
                gender2:"",
                phone2:"",
                idcard2:"",
                name3:"",
                gender3:"",
                phone3:"",
                idcard3:"",
            },
        };
    }

    componentDidMount() {
        console.log("初始化");
        this.props.onRef2('CheckinRecordDetail', this)
    }



    //查看详情
    getMeassage(item) {
        console.info("查看详情===", item);
        let that = this;
            axios.post(api.api_URL + "/check/selectGuestMessageByRoom?id=" + item.id, {

            }, {
                header: {
                    "Content_Type": api.ContentType
                }
            }).then(function (res) {
                console.info(res)
                //that.handleCancel()

               let data1=res.data.object;
                if(data1.name2==null||data1.name2==""){
                    that.setState({
                        detailHiddenForGuest: false,

                    })
                    message.success({content:"没有随性人员！"})
                }else if(data1.name3==null||data1.name3==""){
                    that.setState({
                        hiddenPeopleNumber2:true,
                        param: {
                            // name1: data1.name1,
                            // gender1: data1.gender1,
                            // phone1: data1.phone1,
                            // idcard1: data1.idcard1,
                            name2: data1.name2,
                            gender2: data1.gender2,
                            phone2: data1.phone2,
                            idcard2: data1.idcard2,
                        },
                    })
                }else{
                    that.setState({
                        param: {
                            name3: data1.name3,
                            gender3: data1.gender3,
                            phone3: data1.phone3,
                            idcard3: data1.idcard3,
                        },
                    })
                }
            }).catch(function (err) {
                console.log(err);
            });
    }

        onClickReturnMain = e => {
        this.props.returnMain()
            this.setState({},() => {
                this.clearData()
            });
        }



    returnMain = e => {
        this.setState({
            detailHiddenForGuest: true
        })
    }

    // onRef = (ref) => {
    //     this.child = ref
    //
    // }

    // onRef2=(name,ref) => {
    //     switch (name) {
    //         case 'CheckoutDetail':
    //             this.detail = ref
    //             break
    //     }
    // }
    //清除数据
    clearData() {
        this.setState({
            param: {
                name1: "",
                gender1: "",
                phone1: "",
                idcard1: "",
            }
        })
    }

    render() {
        return (
            <div className="girdBg">
                    <Row className="searchBox">
                        <Col>
                            {/*返回上一级页面*/}
                            <div className="returnBtn" onClick={this.onClickReturnMain}>
                                <LeftOutlined/>
                            </div>
                        </Col>
                    </Row>
                    <Row className="searchBox">
                        <Col span={24}>
                            <Card title="客人信息1" bordered={false}>
                                <p>
                                    <span>随行人员姓名:</span>
                                    <span>{this.state.param.name2}</span>
                                </p>
                                <p>
                                    <span>性别:</span>
                                    <span>{this.state.param.gender2}</span>
                                </p>
                                <p>
                                    <span>身份证号码:</span>
                                    <span>{this.state.param.idcard2}</span>
                                </p>
                                <p>
                                    <span>手机号:</span>
                                    <span>{this.state.param.phone2}</span>
                                </p>
                            </Card>
                        </Col>
                    </Row>
                    <div hidden={this.state.hiddenPeopleNumber2}>
                        <Row className="searchBox">
                            <Card title="随行客人信息2" bordered={false}>
                                <p>
                                    <span>随行人员姓名:</span>
                                    <span>{this.state.param.name3}</span>
                                </p>
                                <p>
                                    <span>性别:</span>
                                    <span>{this.state.param.gender3}</span>
                                </p>
                                <p>
                                    <span>身份证号码:</span>
                                    <span>{this.state.param.idcard3}</span>
                                </p>
                                <p>
                                    <span>手机号:</span>
                                    <span>{this.state.param.phone3}</span>
                                </p>
                            </Card>
                        </Row>
                    </div>
                </div>
        )
    }
}

export default CheckinRecordDetail
